
// 获取到文章类别管理后台数据，对页面进行渲染
initArtCateList()
function initArtCateList() {
  $.ajax({
    type: 'get',
    url: '/my/article/cates',
    success: function (res) {
      if (res.status != 0) {
        return layui.layer.msg('数据请求失败')
      }
      // 调用模板引擎函数，拼接后台数据与页面数据，然后插入到tbody表格中进行渲染
      var htmlstr = template('tpl-table', res)
      $('tbody').html(htmlstr)
    }
  })
}



var layer = layui.layer;
var indexAdd = null;
// 给添加类别按钮添加点击事件，调用layer中的open弹出框，在里面进行插值
// type：表示open弹出框的类型，title：用于设置标题
// area：用数组的方式设置弹出框的宽度和高度
// 在conntent里面对弹出框里面的内容进行添加
$('#btnAddCate').on('click', function () {
  // 获取到弹出框对应的索引号
  indexAdd = layer.open({
    type: 1,
    title: '添加文章内别',
    area: ['500px', '250px']
    // 调用art页面中定义的模板的id，获取到里面的内容，进行添加
    , content: $('#dialog-add').html(),
  });
})

// 通过事件委托的方式，给用模板添加在弹框中的表单，进行submit事件
$('body').on('submit', '#form-add', function (e) {
  // 1、阻止表单的默认提交行为
  e.preventDefault()
  $.ajax({
    type: 'post',
    url: '/my/article/addcates',
    // 2、通过serialize快速获取到表单中用户输入的值
    data: $(this).serialize(),
    success: function (res) {
      if (res.status != 0) {
        return layer.msg('数据添加失败')
      }

      // 图书获取成功后，再次调用渲染的页面
      initArtCateList()
      layer.msg('图书添加成功')
      // 利用layer中的 close方法  根据对应的索引，关闭掉弹出层
      layer.close(indexAdd)
    }
  })
})


// 给 修改淡出层的模板，生成表格的内容
var indexEdit = null
$('tbody').on('click', '.btn-edit', function () {
  // 弹出一个修改文章分类信息的层
  indexEdit = layer.open({
    type: 1,
    area: ['500px', '250px'],
    title: '修改文章分类',
    content: $('#dialog-edit').html()
  })

  // 获取到 后台返回数据的 id
  var id = $(this).attr('data-id')
  // 发起请求获取对应分类的数据
  $.ajax({
    method: 'GET',
    url: '/my/article/cates/' + id,
    success: function (res) {
      layui.form.val('form-edit', res.data)
    }
  })
})

// 通过事件委托，给修改分类用模板添加的表单一个submit 事件, 编辑文章分类
$('body').on('submit', '#form-edit', function (e) {
  // 阻止表单默认提交行为
  e.preventDefault()
  $.ajax({
    method: 'POST',
    url: '/my/article/updatecate',
    // 快速获取到用户输入在表单内的内容
    data: $(this).serialize(),
    success: function (res) {
      if (res.status !== 0) {
        return layer.msg('更新分类数据失败！')
      }
      layer.msg('更新分类数据成功！')
      // 当修改成功后关闭弹出层
      layer.close(indexEdit)
      // 修改成功后，重新渲染页面的数据
      initArtCateList()
    }
  })
})

// 删除操作
$('body').on('click', '.btn-delete', function () {
  var id = $(this).attr('data-id')

  // 引用layui中的 弹出框 来二次询问用户是否删除
  layer.confirm('确认删除?', { icon: 3, title: '提示' }, function (index) {
    $.ajax({
      type: 'get',
      url: '/my/article/deletecate/' + id,
      success: function (res) {
        if (res.status !== 0) {
          return layui.layer.msg('删除数据失败')
        }
        layui.layer.msg('删除数据成功')
        //  关闭掉弹框， 里面的值  就为  引用的弹出层中 回调函数中的 index值
        layer.close(index)
        // 重新渲染页面
        initArtCateList()
      }
    })
  })
})